<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>jsx练习</title>
  </head>
  <body>
    <div id="app"></div>

    <script type="text/javascript" src="../js/react.development.js"></script>
    <script type="text/javascript" src="../js/react-dom.development.js"></script>
    <script type="text/javascript" src="../js/babel.min.js"></script>
    
    <script type="text/babel">
      const data = ['Vue','React','Angular']

      const VDOM = (
        <div>
          <h1>三大框架</h1>
          {
              data.map((item,index) => {
                  return <li key={index}>{item}</li>
              })
          }
        </div>
      )

      ReactDOM.render(VDOM, document.getElementById('app'))
    </script>
  </body>
</html>